<template>
  <div class="mnt-dialog form-container">
    <el-form ref="form" :model="formModel" label-width="160px" :rules="rules">
      <el-row style="text-align: center">
        <el-col :span="12">
          <el-form-item label="工厂:" prop="plantNo">
            <el-select v-model="formModel.plantNo" :disabled="disabledEdit" clearable filterable>
              <el-option v-for="item in plantOptions" :key="item.tmBasPlantId" :label="item.plantNameC" :value="item.plantNo"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="批次号:" prop="batchNo">
            <el-input v-model="formModel.batchNo" disabled>
              <el-button slot="append" type="primary" :disabled="disabledEdit" icon="el-icon-search" @click="queryBatchPlan"></el-button>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="销售类型:" prop="saleType">
            <hey-select v-model="formModel.saleType" disabled clcd="Key_Sale_Type" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="需求类型:" prop="needType">
            <hey-select v-model="formModel.needType" disabled clcd="need_type_cd" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="VIN年份:" prop="vinYear">
            <hey-select v-model="formModel.vinYear" disabled clcd="Key_Vin_ModeYear" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="物料编码:" prop="materialNo">
            <el-input v-model="formModel.materialNo" disabled>
              <el-button slot="append" type="primary" :disabled="disabledEdit" icon="el-icon-search" @click="queryMaterialData"></el-button>
            </el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="物料描述:" prop="materialDesc">
            <el-input v-model="formModel.materialDesc" disabled/>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="车型:" prop="productTypeKey">
            <hey-select v-model="formModel.productTypeKey" disabled clcd="key_product_type" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="生产类型:" prop="proType">
            <hey-select v-model="formModel.proType" :disabled="disabledEdit" clcd="Key_Product_Type" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="是否试制:" prop="isTrialProduct">
            <hey-select v-model="formModel.isTrialProduct" :disabled="disabledEdit" clcd="ind_cd" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="需求日期:" prop="needDate">
            <el-date-picker
              v-model="formModel.needDate"
              type="date"
              :disabled="disabledEdit"
              placeholder="选择日期">
            </el-date-picker>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="计划数量:" prop="qty">
            <el-input v-model="formModel.qty" />
          </el-form-item>
        </el-col>
      </el-row>
    </el-form>
    <el-row class="submit-area">
      <el-col :span="24">
        <el-button @click="closeDialog">取消</el-button>
        <el-button type="primary" @click="handleSubmit()">确定</el-button>
      </el-col>
    </el-row>
    <el-dialog
      v-dialogDrag
      v-if="showBatchPlan"
      :close-on-click-modal="false"
      title="批次计划信息"
      :visible.sync="showBatchPlan"
      width="90%"
      append-to-body
    >
      <batch-plan-dialog @queryBatchPlanSuc="queryBatchPlanSuc" />
    </el-dialog>
    <el-dialog
      v-dialogDrag
      v-if="showMaterialData"
      :close-on-click-modal="false"
      title="物料主数据"
      :visible.sync="showMaterialData"
      width="90%"
      append-to-body
    >
      <material-data-dialog @queryMaterialDataSuc="queryMaterialDataSuc" />
    </el-dialog>
  </div>
</template>

<script>

export default {
  name: 'ProductPlanMnt',
  components: {
    BatchPlanDialog: () => import('@/views/dialog/batch-plan-dialog'),
    MaterialDataDialog: () => import('@/views/dialog/material-data-dialog')
  },
  props: ['pageType', 'editData'],
  data() {
    return {
      disabledEdit:false,
      showBatchPlan:false,
      showMaterialData:false,
      plantOptions:[],
      formModel: {
        rcrdId: '',
        planNo: '',
        plantNo: '',
        batchNo: '',
        saleType: '',
        needType: '',
        materialNo: '',
        materialDesc: '',
        productTypeKey: '',
        proType: '',
        isTrialProduct: '',
        qty: '',
        needDate: '',
        vinYear: '',
      },
      rules: {
      }
    }
  },
  computed: {

  },
  mounted() {
    this.getPlants()
    this.init()
  },
  methods: {
    queryBatchPlan(){
      this.showBatchPlan = true
    },
    queryBatchPlanSuc(data){
      this.formModel.batchNo = data.batchNo
      this.formModel.saleType = data.saleType
      this.formModel.needType = data.needType
      this.formModel.vinYear = data.vinYear
    },
    queryMaterialData(){
      this.showMaterialData = true
    },
    queryMaterialDataSuc(data){
      this.formModel.materialNo = data.materialNo
      this.formModel.materialDesc = data.materialDesc
      this.formModel.productTypeKey = data.productTypeKey
    },
    //获取所有启用的工厂
    getPlants(){
      const param = {pageNum:1,pageSize:9999}
      param.isDelete = '0'
      param.status = '1'
      this.get('/tmBasPlant/queryTmBasPlant', param).then(res => {
        this.plantOptions = res.list
      })
    },
    init() {
      this.$form = this.$refs.form
      const {pageType, editData, formModel} = this
      if (pageType !== 'add') {
        this.disabledEdit = true
        this.assignData(editData, formModel)
      }
      this.initRules()
    },
    initRules() {
      const REQUIRED_MSG = this.CONST.REQUIRED_MSG
      this.rules = {
        plantNo: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        batchNo: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        saleType: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        needType: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        materialNo: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        materialDesc: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        proType: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        isTrialProduct: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        qty: this.HEY_VALIDATOR({ type: ['MAXINT[4]'],required: true}),
        needDate: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
        vinYear: [{ required: true, message: REQUIRED_MSG, trigger: ['change', 'blur'] }],
      }
      this.$nextTick(_ => {
        this.$form.clearValidate()
      })
    },
    handleSubmit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          const { pageType, formModel } = this
          const param = { ...formModel }
          const operateType = pageType === 'edit' ? '02' : '01'
          param.operateType = operateType
          const url = '/teOfmVehiclePlan/maintainTeOfmVehiclePlan'
          const tip = pageType === 'edit' ? '修改成功！' : '新增成功！'
          this.post(url, param).then(res => {
            this.$info(tip, () => {
              this.$emit('mntSuc', res)
              this.closeDialog()
            })
          })
        }
      })
    },
    closeDialog() {
      this.$parent.$emit('update:visible', false)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
